<template>
  <el-dialog
    title="上传图纸"
    :visible.sync="visible"
    width="500px"
    append-to-body
    :close-on-click-modal="false"
  >
    <el-form ref="form" :model="form" :rules="rules" label-width="80px">
      <el-form-item label="上传附件">
        <el-upload
          class="upload-demo"
          :limit="1"
          :action="uploadUrl"
          :before-remove="beforeRemove"
          :file-list="fileList"
          :on-success="handleFileSuccess"
          :before-upload="beforeAvatarUpload"
        >
          <el-button size="small" type="primary">选择文件</el-button>
          <div slot="tip" class="el-upload__tip">
            支持格式:.rar .zip .doc .docx .pdf ，单个文件不能超过20MB
          </div>
        </el-upload>
      </el-form-item>
    </el-form>
    <div slot="footer" class="dialog-footer">
      <el-button type="primary" @click="submitForm">确 定</el-button>
      <el-button @click="cancel">取 消</el-button>
    </div>
  </el-dialog>
</template>
<script>
import { postBuildingImage } from "@/api/system/ai";
export default {
  data() {
    return {
      visible: false,
      form: {},
      rules: {},
      // 上传参数
      uploadUrl: process.env.VUE_APP_BASE_API + "/common/upload",
      fileList: [],
      uploadList: [],
    };
  },
  methods: {
    init(row, buildingId) {
      this.visible = true;
      this.form = row;
      this.form.buildingId = buildingId;
    },
    submitForm() {
      if (this.uploadList.length < 1) {
        this.$modal.msgWarning("请上传图纸");
      } else {
        let list = {};
        list.fileSize = (this.uploadList[0].size / 1024 / 1024).toFixed(2) - 0;
        list.fileUrl = this.uploadList[0].response.fileName;
        list.fileName = this.uploadList[0].name;
        list.buildingId = this.form.buildingId;
        list.floorId = this.form.floorId;
        postBuildingImage(list).then((res) => {
          this.$modal.msgSuccess(res.msg);
          this.$emit("refresh", true);
        });
      }
    },
    cancel() {
      this.visible = false;
    },
    // 移除上传
    beforeRemove(file, fileList) {
      this.uploadList = fileList;
    },
    // 文件上传成功处理
    handleFileSuccess(response, file, fileList) {
      this.uploadList = fileList;
    },
    // 文件上传前的大小
    beforeAvatarUpload(file) {
      // const isRAR = file.type === 'application/x-rar-compressed';
      // const isZIP = file.type === 'application/zip';
      // const isMSOffice = file.type === 'application/vnd.openxmlformats-officedocument.wordprocessingml.document' || // .docx
      //   file.type === 'application/vnd.ms-word' || // .doc
      //   file.type === 'application/pdf'; // .pdf

      // const isAccepted = isRAR || isZIP || isMSOffice;
      // const isLt2M = file.size / 1024 / 1024 < 20;
      // if (!isAccepted) {
      //   this.$message.error('上传文件格式不正确，请上传 .rar、.zip、.doc、.docx 或 .pdf 格式的文件！');
      // }
      // if (!isLt2M) {
      //   this.$message.error('上传头像图片大小不能超过 20MB!');
      // }
      // return isAccepted && isLt2M;
      const isJPG = file.type === "image/jpeg";
      const isPNG = file.type === "image/png";
      const isAccepted = isJPG || isPNG;
      const isLt2M = file.size / 1024 / 1024 < 2; // 注意这里我改为了 2MB，因为你之前写的是 20MB

      if (!isAccepted) {
        this.$message.error("上传文件格式不正确，请上传 .jpg 或 .png 格式的文件！");
      }
      if (!isLt2M) {
        this.$message.error("上传图片大小不能超过 2MB!");
      }
      return isAccepted && isLt2M;
    },
  },
};
</script>

<style></style>
